<template>
  <div>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span style="font-weight: bold; margin-right: 10px;">3D结果预览</span>
        <span>病人编号:</span>{{ filename }}


        <el-button style="float: right; padding: 3px 0" type="text">保存</el-button>
      </div>
      <!--  <iframe width="1500" height="1500" :src="`static/detail/index.html?fileName=${filename}`"></iframe>-->
    </el-card>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
		      <div class="container">
				<div class="navbar-brand" id='demo-toolbar'></div>
		        <div class="collapse navbar-collapse" id="navbarSupportedContent"></div>
		      </div>
    </nav>
    <div id="viewport-HTML-element"></div>
    <div id="labelSeg"></div>
<!--    <div id="hello"></div>-->
  </div>


</template>

<script>

import '../../../static/bundle.js'


export default {
  name: "Result3DInfo",
  props: {
    filename: {
      type: String,
      required: true
    }
  },
  mounted() {
    setTimeout(() => {
      // this.$nextTick(()=>
      const imgpath = this.filename
      window.run2('viewport-HTML-element', '/static/upload/'+imgpath, '/static/label/'+imgpath)
      // window.run2('viewport-HTML-element','/static/upload/0b2be9e0-886b-4144-99f0-8bb4c6eaa848.nii.gz','/static/label/0b2be9e0-886b-4144-99f0-8bb4c6eaa848.nii.gz')
      // })
    }, 1000)
  }
}
</script>

<style scoped>
.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both
}

.box-card {
  width: 100%;
}
</style>
